// components/image-lazy.js
const componentBehavior = require('../../js/common/ComponentBehavior')
const {
  getSystemInfoSync
} = require('../../js/newUtil')

Component({
  lifetimes: {
    attached() {
      // 在组件实例进入页面节点树时执行
      //console.log("attached");

    },
    detached() {
      // 在组件实例被从页面节点树移除时执行
      //console.log("detached");
    },
  },
  /**
   * 组件的属性列表
   */
  properties: {
    key: {
      type: String,
      value: ''
    },
    domain: {
      type: String,
      value: ''
    },
    mode: {
      type: String,
      value: ""
    },
    defpic: {
      type: String,
      value: '/assets/images/img.png'
    },
    src: {
      type: String,
      value: ''
    },
    isShow: {
      type: Boolean,
      value: false
    },
    height: {
      type: Number,
      value: 0
    },
    stylecss: {
      type: String,
      value: ""
    },
    autoFix: { // 当为widthFix模式的图片时，是否要自动重新获取高度（现在只有首页图片组件-单图显示时才用）
      type: Boolean,
      value: false
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    pic: "",
    timer: null,
    imageMode: '',
    systemInfo: null
  },

  behaviors: [componentBehavior],

  lifetimes: {
    attached () {
      this.setData({
        imageMode: this.data.mode
      })
    }
  },
  /**
   * 组件的方法列表
   */
  methods: {
    onImageLazyLoad(e) {
      if (this.data.isShow) return;
      var that = this;
      var src = e.currentTarget.dataset.src;
      setTimeout(function () {
        that.setData({
          isShow: true,
          pic: src
        })
        that.imgAuto()
      }, 200);
    },
    onImageLoadError() {
      var that = this;
      that.setData({
        pic: "/assets/images/img.png"
      })
    },
    imgAuto() {
      let mode = this.data.mode
      let imageMode = this.data.imageMode
      let src = this.data.src
      let systemInfo = this.data.systemInfo
      if (!systemInfo) {
        systemInfo = getSystemInfoSync()
        this.setData({
          systemInfo
        })
      }
      let that = this
      // 只有首页图片组件-单图展示时重设高度
      if (!that.data.autoFix) {
        if (imageMode == '') {
          this.setData({
            imageMode: mode
          })
        }
        return
      }
      // 使用widthFix的图片组件，加载完成后，改为使用aspectFill，并且让高度向上取整
      // 防止多张图片连续防止导致在部分机型上出现空隙
      if (imageMode == 'widthFix' || (imageMode == '' && mode == 'widthFix')) {
        this.setData({
          imageMode: 'widthFix'
        }, function () {
          setTimeout(() => {
            let imageMode = that.data.imageMode
            if (imageMode == 'widthFix' && src) {
              let query = that.createSelectorQuery()
              query.select('.img').fields({
                size: true
              }).exec((res) => {
                if (res && res.length > 0) {
                  if (res[0]) {
                    let height = res[0].height
                    let newHeight = Math.ceil(height)
                    // 只有高度需要变化时才重设图片缩放模式和高度
                    if (newHeight != height) {
                      that.setData({
                        imageMode: 'aspectFill',
                        scaleStyle: `height: ${newHeight}px;`
                      })
                    }
                  }
                }
              })
            }
          }, 1000)
        })
      } else {
        if (imageMode == '') {
          this.setData({
            imageMode: mode
          })
        }
      }
    },
  }
})